<template>
	<div class="crud-container flex-column pt-1 plr-1">
		<cl-tabs-card v-model="activeTab" :tabs="tabs" />
		<cl-flex1 style="overflow: hidden">
			<transition name="fade-transform" mode="out-in">
				<keep-alive>
					<template v-for="tab in tabs">
						<component :key="tab.name" :is="tab.name" v-if="activeTab == tab.name" />
					</template>
				</keep-alive>
			</transition>
		</cl-flex1>
	</div>
</template>

<script>
import Depodeptparam from "./components/paramconfig/depo-dept-param.vue";
import Depoparam from "./components/paramconfig/depo-param";
export default {
	name: "FinanceParamConfig",
	components: {
		Depodeptparam,
		Depoparam
	},
	data() {
		return {
			activeTab: "Depodeptparam",
			tabs: [
				{ label: "部门定金参数", name: "Depodeptparam" },
				{ label: "定金参数", name: "depoparam" }
			]
		};
	},
	mounted() {
		this.activeTab = "Depodeptparam";
	}
};
</script>

<style lang="scss" scoped>
.crud-container {
	height: 100%;
	box-sizing: border-box;
	overflow: hidden;
	background: #fff;
}
</style>
